<script setup lang="tsx">
import { computed, nextTick, onMounted, ref } from 'vue';
import dayjs from 'dayjs';
import { findInnerEqpName, findOuterEqpName } from '@/service/api/modules/collection-management/borehole-data';
import Search from './search.vue';

const props = defineProps({
  type: {
    type: String,
    default: () => 'inner'
  }
});

const tableRef = ref<any>();

const searchParams = ref({
  equipmentId: null,
  subEqpName: null,
  time: null
});

const url = ref('');

const columnChecks = ref<any[]>([
  {
    key: 'index',
    dataIndex: 'index',
    title: '序号',
    width: 70,
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'mainEqpId',
    dataIndex: 'mainEqpId',
    title: '线体代码',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'mainEqpName',
    dataIndex: 'mainEqpName',
    title: '线体名称',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'subEqpId',
    dataIndex: 'subEqpId',
    title: '设备',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'subEqpName',
    dataIndex: 'subEqpName',
    title: '设备名称',
    align: 'center',
    checked: true,
    ellipsis: true
  },

  {
    key: 'pnlId',
    dataIndex: 'pnlId',
    title: 'PNL码',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'trackType',
    dataIndex: 'trackType',
    title: '动作类型',
    align: 'center',
    checked: true,
    ellipsis: true,
    customRender: ({ record }) => {
      // if (record.trackType === 'TRACKIN') {
      //   return '上机';
      // }
      // return '下机';

      const obj = {
        TRACKIN: '上机',
        TRACKOUT: '下机'
      };
      return obj[record.trackType] || '';
    }
  },
  {
    key: 'sliceType',
    dataIndex: 'sliceType',
    title: '片型',
    align: 'center',
    checked: true,
    ellipsis: true
  },
  {
    key: 'dateTime',
    dataIndex: 'dateTime',
    title: '读码时间',
    align: 'center',
    checked: true,
    ellipsis: true
  }
]);

const subEqpId = window.$utils.getRouteParams();

const options = ref([]);
// 路由参数
// 进入页面前获取路由参数
onMounted(() => {
  if (props.type == 'inner') {
    url.value = '/mes/collection-management/pnl-info-collection/inner';
    !['inner', 'outer'].includes(subEqpId) && getOpens();
  } else {
    url.value = '/mes/collection-management/pnl-info-collection/outer';
    !['inner', 'outer'].includes(subEqpId) && getOpens1();
  }
  if (['inner', 'outer'].includes(subEqpId)) {
    search();
  }
});

function reset() {
  nextTick(() => {
    search();
  });
}

function search() {
  nextTick(() => {
    tableRef.value.getData(1);
  });
}

function getOpens() {
  findInnerEqpName().then(({ error, data }) => {
    if (!error) {
      options.value = data;
      searchParams.value.subEqpName = getEquipmentName(subEqpId);
      search();
    }
  });
}
function getOpens1() {
  findOuterEqpName().then(({ error, data }) => {
    if (!error) {
      options.value = data;
      searchParams.value.subEqpName = getEquipmentName(subEqpId);
      search();
    }
  });
}

function getEquipmentName(id) {
  return options.value.find(item => item.subEqpId === id)?.subEqpName || '';
}

const searchData = computed(() => {
  const params = {
    ...searchParams.value
  };
  if (searchParams.value?.time?.[0]) {
    params.startTime = dayjs(searchParams.value.time[0]).format('YYYY-MM-DD');
    params.endTime = dayjs(searchParams.value.time[0]).format('YYYY-MM-DD');
  }
  delete params.time;
  return params;
});
</script>

<template>
  <div class="jl-main-page one-code-ascend min-h-500px flex-col-stretch gap-16px overflow-hidden lt-sm:overflow-auto">
    <Search v-model:model="searchParams" :type="props.type" @reset="reset" @search="search" />
    <!--
 <ACard
      :bordered="false"
      :body-style="{ flex: 1, overflow: 'hidden' }"
      class="table-card flex-col-stretch sm:flex-1-hidden card-wrapper"
    >
      <template #extra>
        <TableColumnSetting v-model:columns="columnChecks" />
      </template>
      <STable
        :columns="columnChecks"
        :data-source="tableData"
        bordered
        size="small"
        :loading="loading"
        row-key="uid"
        :custom-row="customRow"
        :pagination="pagination"
        :scroll="{ x: 1680, y: 'auto' }"
        class="h-full"
        :row-height="23"
      />
    </ACard>
-->

    <Table
      ref="tableRef"
      v-model:searchParams="searchData"
      :column="columnChecks"
      :show-row-selection="false"
      :auto-generate-uuid="true"
      :scroll="{ y: 'auto' }"
      :is-init-get-data="false"
      :url="url"
    ></Table>
  </div>
</template>

<style></style>
